<template>
    <div class="page-container">
        <table>
            <thead>
            </thead>
            <tbody>
                <tr style="height:60px;text-align:center;">
                    <td style="font-size:14px;font-weight:600;">志愿者姓名</td>
                    <td>{{dataInfo.userName}}</td>
                    <td style="font-size:14px;font-weight:600;">联系电话</td>
                    <td>{{dataInfo.mobileNo}}</td>
                    <td style="font-size:14px;font-weight:600;">发放状态</td>
                    <td>{{dataInfo.stat}}</td>  
                </tr>
                <tr style="height:60px;text-align:center;">
                    <td style="font-size:14px;font-weight:600;">兑换积分</td>
                    <td colspan="2">{{dataInfo.integral}}</td>
                    <td style="font-size:14px;font-weight:600;">礼品名称</td>
                    <td colspan="2">{{dataInfo.giftName}}</td>
                </tr>
                <tr style="height:60px;text-align:center;">
                    <td style="font-size:14px;font-weight:600;">收货地址</td>
                    <td colspan="2">{{dataInfo.address}}</td>
                    <td style="font-size:14px;font-weight:600;">兑换类型</td>
                    <td colspan="2">{{dataInfo.convertType}}</td>
                </tr>
                <tr style="height:60px;text-align:center;">
                    <td style="font-size:14px;font-weight:600;">物流公司</td>
                    <td colspan="2">{{dataInfo.lgsCompany}}</td>
                    <td style="font-size:14px;font-weight:600;">物流单号</td>
                    <td colspan="2">{{dataInfo.lgsNumber}}</td>
                </tr>
            </tbody>
            <tfoot>
                <tr style="height:200px;text-align:center;">
                    <td style="text-indent:15px;font-size:14px;font-weight:600;">礼品图片</td>
                    <td colspan="2"><img :src="dataInfo.giftPic" alt="" preview="1" style="width:120px;height:160px;border:0;vertical-align:middle;"></td>
                    <td style="text-indent:15px;font-size:14px;font-weight:600;">说明</td>
                    <td colspan="2">{{dataInfo.remark}}</td>
                </tr>
            </tfoot>
        </table>
    </div>
</template>
<script>
export default {
    name:'giftsrecordDetail',
    props:{
        dataInfo: {// 表格数据
            type:Object,
            required:true
        }, 
    },
    data(){
        return {

        }
    },
    methods:{

    },
    mounted(){

    }
}
</script>
<style lang="scss" scoped>
    table {
        margin:30px 5px;
        border-collapse:collapse;
        border:1px solid #cccccc;
    }
    td {
        border:1px solid #cccccc;
    }
    img{
        cursor: pointer;
    }
</style>
